<template>
    <c-list-template title="入库管理" :operation="true">
        <template slot="search">
            <el-row :gutter="5">

                <el-col :span="6" class="flex-center ">
                    <div class="mr-lg">车辆信息：</div>
                    <el-input v-model="querys.carName" placeholder="请输入车辆信息" class="wh flex-1 mr-lg" />
                </el-col>
                <el-col :span="6" class="flex-center ">
                    <div class="mr-lg">车架号：</div>
                    <el-select v-model="querys.vim" placeholder="请输入车架号" class="wh flex-1 mr-lg">

                    </el-select>
                </el-col>
                <el-col :span="6" class="flex-center ">
                    <div class="mr-lg">仓库名称：</div>
                    <el-select v-model="querys.storeId" placeholder="请选择仓库" class="wh flex-1 mr-lg">
                        <el-option v-for="item in  wareList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                    </el-select>
                </el-col>
                <el-col :span="6" class="flex-center ">
                    <div class="mr-lg">供应商名称：</div>
                    <el-input v-model="querys.sellerName" placeholder="请输入供应商名称" class="wh flex-1 mr-lg" />
                </el-col>
                <!-- <el-col :span="6" class="flex-center  mt-24">
                    <div class="mr-lg">状态：</div>
                    <el-select v-model="querys.status" placeholder="请选择状态" class="wh flex-1 mr-lg">

                    </el-select>
                </el-col> -->
                <el-col :span="24" class="flex-x-end  mt-24">
                    <el-button icon="el-icon-search" type="primary" @click="handleSelect">搜索</el-button>
                    <el-button icon="el-icon-delete" @click="handleReset">重置</el-button>
                </el-col>
            </el-row>
        </template>
        <!-- <template slot="operation">
            <div class="flex-y-center">
                <el-button type="primary">批量入库</el-button>
            </div>
        </template> -->
        <template slot="list">
            <el-table :header-cell-style="{ background: '#F1F1F1', color: '#092132' }" :data="tableData" v-loading="loading">
                <!-- <el-table-column type="selection" width="55" align="center" /> -->
                <el-table-column type="index" width="80" label="序号" align="center" />
                <el-table-column label="车辆信息" align="center" prop="">
                    <template slot-scope="scope">
                        {{scope.row.carBrand}}-{{scope.row.carSeries}}-{{scope.row.carModel}}
                    </template>
                </el-table-column>
                <el-table-column label="车架号" align="center" prop="carVin" />
                <el-table-column label="供应商名称" align="center" prop="sellerName" />
                <el-table-column label="入库仓库名称" align="center" prop="storeName" />
                <el-table-column label="状态" align="center">
                    <template slot-scope="scope">
                        {{scope.row.status == 0?"待入库":""}}
                    </template>
                </el-table-column>
                <el-table-column width="150" label="操作" align="center">
                    <template slot-scope="scope">
                        <el-link type="primary" :underline="false" @click="handleImport(scope.row)">入库</el-link>
                    </template>
                </el-table-column>
            </el-table>
        </template>
        <template slot="pagination">
            <el-pagination background :current-page="querys.current" :page-sizes="[10, 20, 50, 100]" :page-size="querys.size" layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
        </template>
        <c-entry-form ref="cEntryForm" />
    </c-list-template>
</template>
<script>
import cEntryForm from "../components/c-warehousing-form.vue";
export default {
    components: {
        cEntryForm,
    },
    data () {
        return {
            total: 0,
            tableData: [],
            querys: {
                current: 1,
                size: 10,
                status: 0
            },
            loading: false,
            wareList: [],
        };
    },
    mounted () {
        this.tableList();
    },
    methods: {
        handleImport (item) {
            let storeInfo = {}
            this.wareList.forEach((store) => {
                if (item.storeId == store.id) {
                    storeInfo = store
                }
            })
            this.$refs.cEntryForm.handleOpen(item, storeInfo);
        },
        async tableList () {
            this.loading = true;
            const params = JSON.parse(JSON.stringify(this.querys));
            const url = "/storeCar/page";
            this.wareList = await this.$post({ url: "/StoreInfo/list" })
            this.$get({ url, params }).then((res) => {
                this.tableData = res.records;
                this.total = res.total * 1;
                this.loading = false;
            });

        },
        handleReset () {
            this.querys = {
                current: 1,
                size: 10,
            };
            this.tableList();
        },
        handleSelect () {
            this.querys.current = 1;
            this.tableList();
        },
        handleSizeChange (val) {
            this.querys.size = val;
            this.tableList();
        },
        handleCurrentChange (val) {
            this.querys.current = val;
            this.tableList();
        },
    },
};
</script>
